<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link href="shop.css" rel="stylesheet">
    <script src="book.js"></script>
    <script src="shop.js"></script>
</head>
<body>
    <div style="display: flex;padding: 20px;">
        <div style="width: 350px">
            <p>图书名：<span id="nameSpan"></span></p>
            <p>作者：<span id="authSpan"></span></p>
            <p>出版日期：<span id="publishingSpan"></span></p>
            <p>售价：<span id="priceSpan"></span></p>
        </div>
        <img src="" width="300" height="300" id="bookImg"
             style="border: 2px solid #000">
        <div style="width: 500px">
            <h3 style="text-align: center">图书一览</h3>
            <table border="1" width="100%" cellspacing="0">
                <thead>
                    <tr><th>图书名</th><th>作者</th><th>销售价</th><th>操作</th></tr>
                </thead>
                <tbody id="bookData"></tbody>
            </table>
            图书名：<input type="text" id="searchTxt">
                <input type="button" value="搜索" onclick="findByName()">
        </div>
    </div>

    <div class="dialog" id="shopDiv">
        <div class="content">
            <div style="height: 200px;overflow-y: auto">
                <table border="1" width="100%" cellspacing="0">
                    <thead>
                        <tr><th>商品名</th><th>单价</th><th>购买数量</th>
                            <th>单项总价</th><th>移除商品</th></tr>
                    </thead>
                    <tbody id="shopData"></tbody>
                </table>
            </div>
                购物车总价：<span id="totalSpan"></span>
                <input type="button" value="继续购物" onclick="continueBuy()">
            </table>
        </div>
    </div>
</body>
</html>